import React                    from 'react';
import {connect}                from "react-redux";

import Nav                      from "../../config/Navigator";
import QrCode                   from '../../components/form/QrCode';
import BarCode                  from '../../components/form/BarCode';
import {userInfo}               from "../../actions/active";
import {BottomNav, Button}      from '../../components/nav/BottomNav';
import {Token} from '../../utils/Storage'
import {api} from '../../../app/config/api'
import 'qr.scss';

　　function GetUrlParam(paraName) {
    　　　　var url = document.location.toString();
    　　　　var arrObj = url.split("?");
     
    　　　　if (arrObj.length > 1) {
    　　　　　　var arrPara = arrObj[1].split("&");
    　　　　　　var arr;
     
    　　　　　　for (var i = 0; i < arrPara.length; i++) {
    　　　　　　　　arr = arrPara[i].split("=");
     
    　　　　　　　　if (arr != null && arr[0] == paraName) {
    　　　　　　　　　　return arr[1];
    　　　　　　　　}
    　　　　　　}
    　　　　　　return "";
    　　　　}
    　　　　else {
    　　　　　　return "";
    　　　　}
    　　}

class QR extends React.Component {

    componentWillMount(){
        document.title = '我的二维码';
        if(Token.getUserId()){
            this.props.userInfo();
        }else{
            const code = GetUrlParam('code');
            api({
                url:'/weiXinAbutment/selectMIdByWxId',
                method:'GET',
                params:{code}
            }).then((res)=>{
                if(res.data.code === '200'){
                    Token.setMid(res.data.data.m_id)
                    this.props.userInfo();
                }
            })
        }
    }

    render(){
        var {id, qr} = this.props.user;
        return (
            <div className="qr">
                <div className="qr-c flex-avg">
                    <BarCode value={qr} className="big"/>
                    <div className="qr-c-c">
                        <QrCode value={qr}/>
                        <div className="qr-cc-text">{qr}</div>
                    </div>
                    <div className="text">请出示给店员</div>
                </div>
                <BottomNav>
                    <Button label="去修改" to={Nav.activeEdit(id)}/>
                    <Button label="去用券" to={Nav.voucher()}/>
                </BottomNav>
            </div>
        );
    }

}

export default connect(({active: {get}}) => ({user: get}), {userInfo})(QR);
